<template>
  <div>
    <el-card class="mt20">
      <el-row>
        <span style="font-size: 18px;font-weight: bold">审批日志</span>
      </el-row>
      <ld-table ref="logTableRef"
                :url="entApproveLogPageUrl"
                :columns="settledEnterprise.approveLogColumn"
                :where="state.approveLogWhere"
                :isTableTitle="false"
                :isShowData="true"
                :heightIsFixed="true"
                :tableHeight="200"
                :isPage="true">
        <template #folderId="scope">
          <el-link v-if="scope.row.folderId != '-' && scope.row.folderId != null" @click="getFiles(scope.row.folderId)">
            {{ state.loading == true ? '下载中...' : '下载' }}
          </el-link>
          <span v-else>-</span>
        </template>
      </ld-table>
    </el-card>
  </div>
</template>

<script lang="ts" setup>
import {getCurrentInstance, reactive, ref, watch} from 'vue'
import {entApproveLogPageUrl} from "/@/api/entEntry/entApproveLog";
import {settledEnterprise} from "/@/views/enterpriseManager/dictionary/column";
import request from "/@/utils/request";
import {getFileList} from "/@/api/auxiliaryFile";

const {proxy} = getCurrentInstance() as any;
const logTableRef = ref();

const props = defineProps<{
  applyId: string;
}>();


const state = reactive({
  approveLogWhere: {
    operateInfoId: props.applyId
  },
  loading: false,
});
const load = () => {
  logTableRef.value.load();
}

const getFiles = (folderId: string) => {
  state.loading = true;
  getFileList(folderId).then((res) => {
    if (res.success) {
      try {
        let file = {
          annexId: res.data[0].annexId,
          name: res.data[0].fileName,
        };
        downloadFile(file);
      } catch (e) {
        proxy.$wigem.alert.error("未找到附件，下载失败！");
        state.loading = false;
      }
    }
  });
}

const downloadFile = (file: { annexId: string, name: string }) => {
  request({
    url: "/api/system/annex/downFile?fileId=" + file.annexId,
    method: "post",
    responseType: "blob",
  }).then((res) => {
    let extentionType = file.name
        .substring(file.name.lastIndexOf("."))
        .toLowerCase();
    let fileType = "";
    switch (extentionType) {
      case ".doc":
        fileType = "application/msword";
        break;
      case ".txt":
        fileType = "text/plain";
        break;
      case ".docx":
        fileType =
            "application/vnd.openxmlformats-officedocument.wordprocessingml.document";
        break;
      case ".xls":
        fileType = "application/vnd.ms-excel";
        break;
      case ".xlsx":
        fileType =
            "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
        break;
      case ".jpg":
        fileType = "image/jpeg";
        break;
      case ".png":
        fileType = "image/png";
        break;
      case ".ppt":
        fileType = "application/vnd.ms-powerpoint";
        break;
      case ".pdf":
        fileType = "application/pdf";
        break;
      case ".zip":
        fileType = "application/zip";
        break;
      default:
        break;
    }
    let blob = new Blob([res], {type: fileType});
    let link = document.createElement("a");
    link.style.display = "none";
    link.href = window.URL.createObjectURL(blob);
    link.download = file.name;
    document.body.appendChild(link);
    link.click();
    state.loading = false;
  });
};

watch(
    () => props.applyId,
    () => {
      load();
    }
)

// 暴露打开弹窗的方法给父组件使用
defineExpose({
  load
});
</script>
